<template>
    <div>
      <h2>----------------------------------</h2>
        <input type="text" v-model='val1'>
        <input type="text" v-model='val2'>
    </div>
</template>
<script>
// @ is an alias to /src
// 自己使用 watch  再去实现一遍
export default {
    // name: 'XXX',
    props:['value'],
    computed: {
      // val1(){
      //   return this.value.split(/ +/)[0]
      // },
      // val2(){
      //   return this.value.split(/ +/)[1]||''
      // }
      val1:{
        get(){
          return this.value.split(/ +/)[0]
        },
        set(val){
          this.$emit('input',val+' ' + this.val2)
        }
      },
      val2:{
        get(){
          return this.value.split(/ +/)[1]||''
        },
        set(val){
          this.$emit('input',this.val1+' ' + val)
        }
      }
    },
    data() {
        return {
        
        }
    },
    components: {
        
    }
}
</script>
<style lang="less">

</style>